<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			li {
				background-color: pink;
			}
		</style>
	</head>
	<body>
		<textarea name="" id="">123</textarea>
		<button type="button">发布</button>
		<ul>

		</ul>
		<script type="text/javascript">
			//1.获取元素
			var text = document.querySelector("textarea");
			var btn = document.querySelector("button")
			var ul = document.querySelector("ul");
			//2.注册事件
			btn.onclick = function() {
				if (text.value != "") {
					//(1)创建元素
					var childLi = document.createElement("li");
					//(2)将文本内容 填入到li中
					// var content=text.textContent;
					childLi.innerHTML = text.value;
					//(3)拼接li
					//拼接到最后面
					// ul.appendChild(childLi);
					//拼接到最前面
					ul.insertBefore(childLi, ul.children[0])
				} else {
					alert("未输入");
					return false;
				}
			}
		</script>
	</body>
</html>
